<!-- 预订selectTable的骨架屏 -->
<template>
	<view>
		<view class="yyt-st-skeleton" :style="{ top: top + 'rpx' }" v-if="show">
			<!-- 区域名称 -->
			<view class="yyt-st-area-name"></view>
			<!-- 桌台列表 -->
			<view class="yyt-st-table-list-wrapper" :style="{height:'calc(100vh - '+baseHeight+')'}" style="height: calc(100vh - 100px);">
				<div v-for="a in 12"></div>
			</view>
		</view>
		<view v-else><slot></slot></view>
	</view>
</template>

<script>
export default {
	name: 'yyt-st-skeleton',
	props: {
		top: {
			type: Number,
			default: 100,
			require: false
		},
		show: {
			type: Boolean,
			default: true,
			require: true
		},
		baseHeight:{
			type:String,
			default:'200px',
			require:false
		}
	},
	components: {},
	data() {
		return {};
	},
	methods: {}
};
</script>

<style lang="less" scoped>
@import url('yyt-st-skeleton.less');
</style>
